<?php
echo <<<EOT
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>接口参数在线查询</title>
    <meta name="robots" content="none" />
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="//cdn.bootcss.com/codemirror/5.12.0/codemirror.css">
    <link rel="stylesheet" href="//cdn.bootcss.com/codemirror/5.12.0/theme/monokai.min.css">
    <link rel="stylesheet" href="//cdn.bootcss.com/codemirror/5.12.0/addon/fold/foldgutter.min.css">
    <script src="//cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
    <script src="//cdn.bootcss.com/codemirror/5.12.0/codemirror.js"></script>
    <script src="//cdn.bootcss.com/codemirror/5.12.0/addon/fold/foldcode.min.js"></script>
    <script src="//cdn.bootcss.com/codemirror/5.12.0/addon/fold/foldgutter.min.js"></script>
    <script src="//cdn.bootcss.com/codemirror/5.12.0/mode/javascript/javascript.min.js"></script>
    <script src="http://www.menma.me/public/js/vkbeautify.js"></script>
</head>

<body>

<br /> 

<div class="container">

<div class="jumbotron">

EOT;

echo "<h2>接口：$service</h2><br/><p><strong>$description</strong><br/>$descComment</p><br/>";

echo <<<EOT
<h3>接口参数</h3>
<table class="table table-striped .table-hover" >
<thead>
<tr><th>参数名字</th><th>类型</th><th>是否必须</th><th>默认值</th><th>其他</th><th>说明</th></tr>
EOT;

foreach ($rules as $key => $rule) {
    $name = $rule['name'];
    if (!isset($rule['type'])) {
        $rule['type'] = 'string';
    }
    $type = isset($typeMaps[$rule['type']]) ? $typeMaps[$rule['type']] : $rule['type'];
    $require = isset($rule['require']) && $rule['require'] ? '<font color="red">必须</font>' : '可选';
    $default = isset($rule['default']) ? $rule['default'] : '';
    if ($default === NULL) {
        $default = 'NULL';
    } else if (is_array($default)) {
        $default = json_encode($default);
    } else if (!is_string($default)) {
        $default = var_export($default, true);
    }

    $other = '';
    if (isset($rule['min'])) {
        $other .= ' 最小：' . $rule['min'];
    }
    if (isset($rule['max'])) {
        $other .= ' 最大：' . $rule['max'];
    }
    if (isset($rule['range'])) {
        $other .= ' 范围：' . implode('/', $rule['range']);
    }
    $desc = isset($rule['desc']) ? trim($rule['desc']) : '';

    echo "<tr><td>$name</td><td>$type</td><td>$require</td><td>$default</td><td>$other</td><td>$desc</td></tr>\n";
}

echo <<<EOT
</table>
EOT;

echo <<<EOT
<script>
EOT;
if($rules) {
    echo "var rules=".json_encode($rules);
}else{
    echo "var rules=false";
}
echo <<<EOT
</script>
EOT;

echo <<<EOT
<br>

<h3>返回结果</h3>
<table class="table table-striped" >
<thead>
<tr><th>返回字段</th><th>类型</th><th>说明</th></tr>
EOT;

foreach ($returns as $item) {
    $name = $item[1];
    $type = isset($typeMaps[$item[0]]) ? $typeMaps[$item[0]] : $item[0];
    $detail = $item[2];

    echo "<tr><td>$name</td><td>$type</td><td>$detail</td></tr>";
}

echo <<<EOT

</table>

<br/>

    <div role="alert" class="alert alert-info">
      <strong>温馨提示：</strong> 此接口参数列表根据后台代码自动生成，可将 ?service= 改成您需要查询的接口/服务
    </div>

<!--API调试-->
        <h3>API调试</h3>

        <form class="form-inline" id="ApiTest">
            <div class="form-group col-md-2">
                <select id="js-req-method" class="form-control col-md-12" style="width:100%">
                    <option value="GET">GET</option>
                    <option value="POST" selected="">POST</option>
                    <option value="PUT">PUT</option>
                    <option value="PATCH">PATCH</option>
                    <option value="DELETE">DELETE</option>
                    <option value="COPY">COPY</option>
                    <option value="HEAD">HEAD</option>
                    <option value="OPTIONS">OPTIONS</option>
                    <option value="LINK">LINK</option>
                    <option value="UNLINK">UNLINK</option>
                    <option value="PURGE">PURGE</option>
                </select>


            </div>
            <div class="form-group col-md-8">
EOT;

              echo  '<input type="text" class="form-control" id="apiServiceUrl" disabled style="width:100%" value="http://'.str_replace("/Public","",str_replace("checkApiParams.php","",$_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"])).'">';
 echo <<<EOT
            </div>

            <button type="submit" class="btn btn-primary col-md-2">发送</button>
            <br/> <br/>
            <br/>
            <div >
                <table class="table table-bordered"  id="RequestTable" >
                    <thead>
                    <tr class="info">
                        <th style="width: 300px">参数</th>
                        <th>值</th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>
                <span class="btn btn-success" id="addParameter">添加</span>
            </div>
            <br/> <br/>
            <br/>

                <table class="table table-bordered" style="display: none"  id="js-res">
                    <thead>
                    <tr class="info">
                        <th  style="width: 300px">Response Header</th>
                        <th>Response Body</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <tr>
                        <td style="width: 300px">
                            <textarea id="js-res-header" class="form-textarea"></textarea>
                        </td>
                        <td>
                            <textarea id="js-res-content" class="form-textarea"></textarea>
                        </td>
                    </tr>
                    </tr>
                    </tbody>
                </table>


        </form>
        <script type="text/javascript" language="javascript">
        var JQ=jQuery.noConflict();JQ(function(){var a=' <tr><td> <input type="text" class="form-control"  maxlength="100"> </td><td><input type="text" class="form-control" maxlength="5000"> </td> <td><span  class="btn btn-danger">X</span> </td> </tr>';rules&&(JQ.each(rules,function(b,c){c.require&&JQ("#RequestTable tbody").append(a.replace('maxlength="100"','maxlength="100" value="'+c.name+'"').replace('maxlength="5000"','maxlength="5000" placeholder="'+c.desc+'"'))})),JQ("#addParameter").on("click",function(){JQ("#RequestTable tbody").append(a)}),JQ("#RequestTable").on("click",".btn-danger",function(){JQ(this).parents("tr").remove()});var b=CodeMirror.fromTextArea(JQ("#js-res-header")[0],{value:"",lineNumbers:!1,mode:"javascript",theme:"monokai",indentUnit:4,lineWrapping:!1,styleActiveLine:!0,matchBrackets:!0,readOnly:!0}),c=CodeMirror.fromTextArea(JQ("#js-res-content")[0],{value:"",lineNumbers:!0,theme:"monokai",indentUnit:4,lineWrapping:!0,styleActiveLine:!0,matchBrackets:!0,autoCloseBrackets:!0,foldGutter:!0,gutters:["CodeMirror-linenumbers","CodeMirror-foldgutter"],readOnly:!0});JQ("#ApiTest").on("submit",function(){var a="",d=!0,e=JQ("#apiServiceUrl").val();return e?(JQ("#RequestTable input").each(function(b){if(!d)return!1;var c=JQ(this).val();c?a+=b%2==0?c:"="+c+"&":(JQ(this).focus(),alert((b%2==0?"参数":"参数值")+"必填"),d=!1)}),d?(console.log(a),JQ.ajax({url:e,method:JQ("#js-req-method").val(),data:a,dateType:"json",success:function(a,d,e){JQ("#js-res").show(),b.setValue(decodeURIComponent(e.getAllResponseHeaders())),c.setValue(vkbeautify.json(JSON.stringify(a),4)),JQ("html,body").animate({scrollTop:JQ("#js-res").offset().top},800)},error:function(a){JQ("#js-res").show(),b.setValue(decodeURIComponent("status:"+a.status)),c.setValue(vkbeautify.json(JSON.stringify(a.statusCode()),4)),JQ("html,body").animate({scrollTop:JQ("#js-res").offset().top},800)}}),!1):!1):!1})});
        </script>
        <!--API调试-->


</div> <!-- /container -->

</body>
</html>
EOT;


